/* 
	该文件是一个Vue的插件
*/

//定义好一个Vue插件
let atguigu = {
	//install方法何时调用？ —— 当atguigu这个插件被安装（应用）的时候，install就会调用。
	install(Vue){
		// console.log('atguigu插件的install方法被调用了，也就意味着，atguigu这个插件，被应用了')
		
		//定义一个全局的过滤器
		Vue.filter('slice2Char',function(value){
			return value.slice(0,2)
		})

		//定义一个全局的指令
		Vue.directive('very-big',function(element,{value}){
			// console.log('@',this) //此处的this不是vm
			//如果指令的值是数值类型
			if(typeof(value) === 'number'){
				element.innerText = value*10
				if(value >= 5){
					element.style.color = 'red'
					element.style.backgroundColor = 'skyblue'
				}
			}
			//如果指令的值不是数值类型
			else{
				throw('指令使用错误，请指定数值类型')
			}
		})

		//定义一个全局的指令
		Vue.directive('very-beauty',function(element,{value}){
			element.innerText = value
			element.style.color = 'red'
			element.style.backgroundColor = 'yellow'
			element.style.border = '3px solid green'
		})

		//给Vue的原型对象上追加属性
		Vue.prototype.projectName = '学生管理系统'
		
		//给Vue的原型对象上追加方法
		Vue.prototype.welcome = function(){
			alert('同学，欢迎你呀！')
		}

	}
}